
@charset "utf8"; 

/* http://meyerweb.com/eric/tools/css/reset/
   v3.0 | 20180413
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
main, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
  vertical-align: baseline;
  
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, main, menu, nav, section {
  display: block; 
}
*{ -webkit-box-sizing: border-box; box-sizing: border-box; }
/* HTML5 hidden-attribute fix for newer browsers */
*[hidden] {
    display: none;
} 
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
table td { word-break: break-all; }
 
html{  font-size: 100px;width: 100%; height: 100%;  -ms-text-size-adjust: 100%;  -webkit-text-size-adjust: 100%;     overflow: hidden;  overflow-y: auto; }
body { font-family: "Microsoft YaHei",Arial, "simsun"; font-size: 14px; font-weight: 400; margin: 0 auto; line-height: 1.5; text-align: left; color: #666; background: #fff;     overflow-x: hidden;max-width: 640px; }
 

input,button,textarea{font-family: "微软雅黑";border: none; outline: none;  }
input[type="submit"]{cursor: pointer; }
button {  border-radius: 0;   }
input { border: none; border-radius: 0; outline: none; -webkit-appearance: none; }
 
input:-webkit-autofill { box-shadow: 0 0 0px 1000px white inset !important;} 

input::-webkit-input-placeholder { color: #999; }

input:-ms-input-placeholder { color: #999; }

input::-ms-input-placeholder { color: #999; }

input::-webkit-input-placeholder { color: #999; }

input:-ms-input-placeholder { color: #999; }

input::placeholder { color: #999; }

textarea::-webkit-input-placeholder { color: #999; }

textarea:-ms-input-placeholder { color: #999; }

textarea::-ms-input-placeholder { color: #999; }

textarea::-webkit-input-placeholder { color: #999; }

textarea:-ms-input-placeholder { color: #999; }

textarea::placeholder { color: #999; }

img { height: auto; vertical-align: middle; -ms-interpolation-mode: bicubic; border: none } 

/* ============================== 清除浮动 ============================== */
.clear { clear: both; font-size: 0px; height: 0;overflow: hidden; } 
.fl { float: left;display: block } 
.fr { float: right;display: block } 

.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;font-size: 0;} 
/* .clearfix { *zoom:1;} */
/* ============================== 清除浮动 ============================== */
  

/* ============================== 全局的字体链接 ============================== */
a{ text-decoration: none;  }
a:link, a:visited { color: #666;  } 
a:hover, a:active {  color: rgb(4, 107, 2); -webkit-transition: all 0.3s; transition: all 0.3s;}
/* ============================== 全局的字体链接 ============================== */

.delay200 { -webkit-animation-delay: 0.2s; animation-delay: 0.2s; }

/* ============================== 图片放大 ============================== */
._img { overflow: hidden; cursor: pointer; display: block; } 
._img img { -webkit-transition: all 0.3s; transition: all 0.3s; } 
._img:hover img { -webkit-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); }
/* ============================== 图片放大 ============================== */



.main,.main2,.main3{  clear: both;  max-width: 640px; width: 100%;position: relative; }
.main {  overflow: hidden; margin: 0 auto; } 
.main2 {      }
.main3 {   } 
.tr { text-align: right; } 
.tc { text-align: center; }
.t-o { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;   -o-text-overflow: ellipsis;     }
.pic{ display: block;overflow: hidden; }
.tit{ display: block;overflow: hidden;  white-space: nowrap; text-overflow: ellipsis;}
.pic img{ width: 100%;height: 100%;   }
.f00{ color: #f00 }
/* ============================== flex布局 需要IE10+ ============================== */

.df,.dfc,.dfb{ width: 100%;  flex-wrap: wrap; display: flex; align-items: center ; }
.df {   }
.dfc{justify-content: center; flex-direction: column}
.dfb{   justify-content: space-between; }

/* ============================== flex布局 需要IE10+ ============================== */
 
 
 
.slice img{width: 100%;  }
[v-cloak] {
  display: none;
}
 
 .p-0-10{padding:0 10px}
.h60,
.h50,
.h40,
.h30,
.h20,
.h10,.h2{ width:100%;display:block;clear:both;overflow:hidden }
  
.h60{height:60px;}
.h50{height:50px;}
.h40{height:40px;}
.h30{height:30px;}
.h20{height:20px;}
.h10{height:10px;}
.h2{height:2px;}

/* ============================== 加载动画 ============================== */

.weui_toast{position: fixed;z-index:1000;width: 7.6em;min-height: 7.6em;top: 180px;left: 50%;margin-left: -3.8em;/* background: rgba(40, 40, 40, .75); */text-align: center;border-radius: 5px;color: #FFF}
.weui_toast_content{margin: 0 0 15px;color: #000}
.spinner{width: 50px;height: 50px;text-align: center;font-size: 10px;margin: 0 auto;margin-top: 30px}
.spinner>div{background-color: #000;height: 100%;width: 2px;display: inline-block;margin-right: 3px;-webkit-animation: stretchdelay 1.2s infinite ease-in-out;animation: stretchdelay 1.2s infinite ease-in-out}
.spinner .rect2{-webkit-animation-delay: -1.1s;animation-delay: -1.1s}
.spinner .rect3{-webkit-animation-delay: -1s;animation-delay: -1s}
.spinner .rect4 { -webkit-animation-delay: -.9s; animation-delay: -.9s; }
.spinner .rect5 { -webkit-animation-delay: -.8s; animation-delay: -.8s; }
@-webkit-keyframes stretchdelay {
    0%,100%,40% { -webkit-transform: scaleY(.4); }
    20% { -webkit-transform: scaleY(1); }
}
@keyframes stretchdelay {
    0%,100%,40% { transform: scaleY(.4); -webkit-transform: scaleY(.4); }
    20% { transform: scaleY(1); -webkit-transform: scaleY(1); }
}
/* ============================== 加载动画 ============================== */
/* ============================== 进度条 ============================== */ 
.loading-top{
  background:#ff0000;  
height:2px;  width: 100%;
position:fixed;  
top:0;  opacity: 0;
z-index:99999  ;-webkit-transform-origin: left;transform-origin: left;
-webkit-animation: loading-top 1s   ease-in-out 1 alternate forwards;
        animation: loading-top 1s   ease-in-out 1 alternate forwards
}  

.progressBar{   background:#ff0000;  
  height:2px;  width: 100%;
  position:fixed;  
  top:0;  
  z-index:99999  ;-webkit-transform-origin: left;transform-origin: left; -webkit-animation: loading-top 1s   ease-in-out 1 alternate forwards; animation: loading-top 1s   ease-in-out 1 alternate forwards}
@-webkit-keyframes loading-top {
    0%{ -webkit-transform: scaleX(0); transform: scaleX(0); opacity: 0;}
    20%{ -webkit-transform: scaleX(.3); transform: scaleX(.3); opacity: 0;}
  40% { -webkit-transform: scaleX(.5); transform: scaleX(.5); opacity: .4;}
  60% { -webkit-transform: scaleX(.7); transform: scaleX(.7); opacity: .8;}
  80% { -webkit-transform: scaleX(.9); transform: scaleX(.9); opacity: .9;}
  100%{ -webkit-transform: scaleX(1); transform: scaleX(1);   opacity: 1;}
}
@keyframes loading-top {
    0%{ -webkit-transform: scaleX(0); transform: scaleX(0); opacity: 0;}
    20%{ -webkit-transform: scaleX(.3); transform: scaleX(.3); opacity: 0;}
  40% { -webkit-transform: scaleX(.5); transform: scaleX(.5); opacity: .4;}
  60% { -webkit-transform: scaleX(.7); transform: scaleX(.7); opacity: .8;}
  80% { -webkit-transform: scaleX(.9); transform: scaleX(.9); opacity: .9;}
  100%{ -webkit-transform: scaleX(1); transform: scaleX(1);   opacity: 1;}
}
/* ============================== 进度条 ============================== */


/* ============================== 标题底部边框 ============================== */
.splitBorder{ position: relative ;display: inline-block;}
.splitBorder::before,.splitBorder::after{ position: absolute;content: '';bottom: 0;width: 50%;height: 2px; -webkit-transition: all .3s ease-in; transition: all .3s ease-in;}
.splitBorder::before{ background-color: #f60000;left: 0;  }
.splitBorder::after{ background-color: #7b7b7b;right: 0; }
.splitBorder:hover::before,.splitBorder:hover::after{ width: 0%; } 

.tit-border{ position: relative; line-height: 1; overflow: hidden;}
.tit-border::before,.tit-border::after{content:'';  position: absolute;}
.tit-border::before{ background-color: #f00;width: 55px;height: 3px;left: 0;bottom: 0; }

/* ============================== 标题底部边框 ============================== */

/* ============================== 列表分页 start ============================== */

div.digg { clear: both; padding: 35px 0; text-align: center; display: block; border-radius: 4px; font-size: 0px;   line-height: 36px; line-height: 0.36rem; }
div.digg a {   padding: 5px 12px; border: 0px solid #f60000;   color: #f60000; background: #fff; text-decoration: none; }

div.digg a:hover { z-index: 3; color: #666; background: #dcf2ff; }

div.digg a, div.digg span {font-size: 14px; padding: 5px 10px;margin-left: -1px;  color: #666; text-decoration: none; background: #fff; border: 1px solid #ddd; display: inline-block; }
div.digg span { }
div.digg span.disabled { background: #fff; color: #aaa; }

div.digg span.current { background: #f00; color: #fff; border: 1px solid #f00;position: relative;z-index: 2; }
  @media screen and ( max-width:640px ){
    .digg span:first-child{ display: none }
  }


#page_next { border: 1px solid #e5e5e5; margin: 18px auto 28px; }
#page_next.page_next {/* position: absolute;bottom: 0;left: 30px; */width: 93%;}
#page_next li { line-height: 36px; font-size: 16px; background-color: #fcfcfc; border-bottom: 1px dashed #e5e5e5; }
#page_next li::after { content: "";clear: both;visibility: hidden;display: block }
#page_next li:nth-last-of-type(1) { border-bottom: none; }
#page_next li span { padding-left: 15px; color: #017a37;float: left; }
#page_next li a { float: left; display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width: 75%; }

/* ============================== 列表分页 end ============================== */

    /* ============================== 分享 ============================== */
    #contact_fenxiang {    margin-top: 12px;}
    #contact_fenxiang .bdsharebuttonbox a { background-image: url("../images/song_fenxiang_contact.png"); background-repeat: no-repeat; height: 28px; width: 28px; margin-right: 22px; }
#contact_fenxiang .bdsharebuttonbox a:nth-child(2) { background-position: -33px 0; }
#contact_fenxiang .bdsharebuttonbox a:nth-child(3) { background-position: -67px 0; }
#contact_fenxiang .bdsharebuttonbox a:nth-child(4) { background-position: -100px 0; margin-right: 0; }

    /*============================== 分享 ============================== */ 
 
/* ============================== 遮罩层 关闭按钮 ============================== */
.webMask div{ position: relative;max-width: 90%; z-index: 999999;}
.webMask div:before{     position: absolute;cursor: pointer;
  content: "X";
  top: -15px;
  right: -15px;
  width: 30px;
  height: 30px;
  font-size: 16px;
  text-align: center;
  background-color: #ccc;
  border-radius: 50%;
  line-height: 30px;
  color: #f60000; box-shadow: 0 0 10px rgba(0, 0, 0, 0.6) }
  
  /* ============================== 遮罩层 关闭按钮 ============================== */

/* ============================== 伸展条 ============================== */
.pgnav{margin-top:20px; margin-bottom: 35px; border-bottom:1px solid #eee; color: #666; border-left:3px solid #f60000;text-indent:10px;font:16px/35px "microsoft yahei"; position: relative;}
.pgnav::after{-webkit-transition:all .5s cubic-bezier(.68,-.55,.27,1.55);transition:all .5s cubic-bezier(.68,-.55,.27,1.55);animation:lineout .5s infinite;-webkit-animation:lineout .5s infinite;animation-iteration-count:1;-webkit-animation-iteration-count:1;position:absolute;bottom:0px;left:0;display:inline-block;content:"";height:1px;width:0;background:#eee} 

.pgnav:hover:after {-webkit-transition:all .5s cubic-bezier(.68,-.55,.27,1.55);transition:all .5s cubic-bezier(.68,-.55,.27,1.55);animation:linemove .5s infinite;-webkit-animation:linemove .5s infinite;animation-iteration-count:1;-webkit-animation-iteration-count:1;position:absolute;bottom:0px;left:0;display:inline-block;content:"";height:1px;width:100%;background:#f60000}
@keyframes lineout{from{width:100%}to{width:0}}
@-webkit-keyframes lineout{from{width:100%}to{width:0}}
/* ============================== 伸展条 ============================== */


/* ============================== 自定义下拉框 ==============================
  html: <div class="custom-select-container" tabindex="-1">
          <span class="custom-select-span"></span>
          <ul class="custom-select-list">
            <li></li>
          </ul>
        </div>
*/
.custom-select-container {
  position: relative;
  width: 100%;
  height: 30px;
  border-radius: 4px;
}
.custom-select-container:before {
  position: absolute;
  content: '';
  right: 8px;
  top: 12px;
  border-top: 6px solid #676767;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}
.custom-select-container:focus .custom-select-list {
  display: block;
}
.custom-select-span {
  display: block;
  box-sizing: border-box;
  height: 100%;
  width: 100%;
  padding: 4px 4px 4px 8px;
}
.custom-select-list {
  display: none;
  position: absolute;
  top: 30px;
  width: 100%;
  background-color: #fff;
  list-style: none;
}
.custom-select-list > li {
  box-sizing: border-box;
  padding: 4px 4px 4px 8px;
  list-style: none;
}
.custom-select-list > li:hover {
  outline: 1px solid rgb(6, 120, 250);
}
  
/* ============================== 自定义下拉框 ============================== */ 